<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org">
<head th:include="_header_include::frag(~{::title},~{},~{})" >
	<title>信息流分配规则</title>
 
</head>
<body>
<div id="informationAllot" class="informationAllot mainPadding" style="display: none;">  
    <el-breadcrumb separator="/" class="elBreadcrumb marginB20">
        <el-breadcrumb-item>Home</el-breadcrumb-item>
        <el-breadcrumb-item>业务设置</el-breadcrumb-item>
        <el-breadcrumb-item>信息流分配电销组规则</el-breadcrumb-item>
    </el-breadcrumb>
    <el-row class="marginB20">
       <!--<shiro:hasPermission name="infoAssign:add">-->
           <el-button type="primary" @click="openAddRuleDialog"><i class="el-icon-plus"></i>添加</el-button>
        <!--</shiro:hasPermission>-->
           <!--<shiro:hasPermission name="infoAssign:edit">-->
        <el-button type="success"  @click="openUpdateRuleDialog" ><i class="el-icon-edit"></i>编辑</el-button>
        <!--</shiro:hasPermission>-->
       <!--<shiro:hasPermission name="infoAssign:delete">-->
         <el-button type="danger" @click="deleteDialog"><i class="el-icon-delete"></i>删除</el-button>
        <!--</shiro:hasPermission>-->
    </el-row>
    <div class="mainSearchBg">        
        <div class="mainSearchFormBox">
            <el-form :inline="true" class="demo-form-inline mainSearchForm">
                <el-form-item label="电销组:" label-width="55px">
                    <el-select v-model="telemarketingId" placeholder="电销组" style="width: 100%;"  clearable>
                        <el-option
                            v-for="item in orgOption"
                            :key="item.id"
                            :label="item.name"
                            :value="item.id">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="项目:" label-width="60px">
                    <el-select v-model="projectId" placeholder="项目" style="width: 100%;"  clearable>
                        <el-option
                            v-for="item in proOption"
                            :key="item.projectName"
                            :label="item.projectName"
                            :value="item.projectName">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="规则名称:" label-width="90px" style="margin-right: 10px;">
                    <el-input v-model="assignName" placeholder="规则名称" class="input-with-select"></el-input>
                </el-form-item>
                <el-form-item label="">
                    <el-button icon="el-icon-search" type="primary"  @click="initTableData" >搜索</el-button>
                </el-form-item>
            </el-form>
        </div>
        <el-row>
            <el-table 
                ref="multipleTable"
                tooltip-effect="dark"
                style="width: 100%"
                @selection-change="handleSelectionChange"
                border
                :data="dataTable" 
                >
                <el-table-column align="center" type="selection" prop="id" @selection-change="handleSelectionChange"  width="55"></el-table-column>
                <el-table-column align="center" type="index" label="序号" width="55"></el-table-column>
                <el-table-column align="center" prop="assignName" label="规则名称"></el-table-column>
                <el-table-column align="center" prop="releAssignId" label="规则ID"></el-table-column>
                <el-table-column align="center" prop="projectName" label="项目名称"></el-table-column>
                <el-table-column align="center" prop="telemarketingName" label="电销组"></el-table-column>
                <el-table-column align="center" prop="telemarketingDirectorName" label="电销总监姓名"></el-table-column>
            </el-table>
             <table-pagination :pager="pager" @change="initTableData"></table-pagination> 
        </el-row>
    </div>
    <el-dialog  :title="dailogTitleType+'规则'" :visible.sync="updateDialogFormVisible" width="40%"  >
        <!-- <el-form :model="form" ref="form" :rules="rules" class="width500"> -->
        <el-form :model="form" ref="form" :rules="rules" >
            <el-form-item label="项目：" :label-width="formLabelWidth" prop="valueMultiple">
                <el-select v-model="form.valueMultiple" multiple placeholder="选择项目" style="width: 90%;">
                    <el-option
                        v-for="item in proOption"
                        :key="item.id"
                        :label="item.projectName"
                        :value="item.id">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="电销组：" :label-width="formLabelWidth" prop="value">
                <el-select v-model="form.value" placeholder="选择电销组" style="width: 90%;">
                    <el-option
                        v-for="item in orgOption"
                        :key="item.id"
                        :label="item.name"
                        :value="item.id">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="规则名称：" :label-width="formLabelWidth" prop="ruleName">
                <el-input v-model="form.ruleName"   maxlength="50" style="width: 90%;"></el-input>
            </el-form-item>
            <el-form-item label="规则ID："    :label-width="formLabelWidth" prop="ruleID">
                <el-input v-model="form.ruleID" @keyup.native="number" maxlength="19" style="width: 90%;"></el-input>
            </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer" style="text-align:center;">
            <el-button type="primary" :disabled="btnDisabled" @click="submitFormType('form')">提交</el-button>
            <el-button @click="updateDialogFormVisible=false">取消</el-button>
        </div>
    </el-dialog>
</div>
<!-- import common js-->
<div th:include="_footer_include :: #jsLib"></div>
</body>
<script th:inline="javascript"  >
//下拉机构数据
var orgSelect=[[${orgSelect}]];
//下拉项目数据
var proSelect=[[${proSelect}]];
  var ruleVm=new Vue({
        el: '#informationAllot',
        data: function() {
            return {
                btnDisabled: false,
                dialogFormVisible: false,
                updateDialogFormVisible:false,
                form: {
                    value:'',
                    ruleName:'',
                    ruleID:'',
                    valueMultiple:[]
                },
                formLabelWidth: '100px',
                dataTable: [],
                dailogTitleType:'添加',
                pager:{ 
                    total: 0,
                    currentPage: 1,
                    pageSize: 20,
                },
                proOption: proSelect,
                orgOption:orgSelect,
                telemarketingId: '',//下拉选项默认值
                projectId: '',//下拉选项默认值
                assignName:'',
                valueMultiple:[],
                multseleSelection:[],
                oldruleId:'',
                oldruleName:'',
                oldruleRefId:'',
                FormType:'1',
                rules: {
                    valueMultiple: [
                        { required: true, message: '请选择项目', trigger: 'change' }
                    ],
                    value: [
                        { required: true, message: '请选择电销组', trigger: 'change' },
                    ],
                   
                    ruleName: [
                        { required: true, message: '请输入规则名称', trigger: 'blur' },
                        {validator:function(rule,value,callback){
                        	if(ruleVm.oldruleName==value&&ruleVm.oldruleId){
                        		   callback();
                        	}
             			    var param = {'assignName':value};
                             axios.post('/assignrule/infoAssign/findListInfoAssignByName',param)
                             .then(function (response) {
                                 var data =  response.data;
                                 if(data.code=='0'){
                                     var resData = data.data;
                                     if(resData.length>0){
                                         callback(new Error("此分配规则名称已存在，请修改后提交"));
                                     }else{
                                         callback();
                                     }
                                     
                                 }else{
                                      callback(new Error("查询分配规则名称是否唯一报错"));
                                 }
                             })
                             .catch(function (error) {
                               console.log(error);
                             })
                             .then(function () {
                               // always executed
                             });
             			  
             		  },trigger:'blur'}
                    ],
                    ruleID: [
                        { required: true, message: '请输入规则ID', trigger: 'blur' },
                        {  max: 19, message: '最大19个字符', trigger: 'change' },
                        {validator:function(rule,value,callback){
                            if(/^[0-9]*$/.test(value) == false){// 校验是否是数字
                               callback(new Error("请输入数字"));
                            }else{
                               callback();
                            } // 校验是否是数字结束
                        	if(ruleVm.oldruleRefId==value&&ruleVm.oldruleId){
                        		   callback();
                        	}
             			    var param = {'releAssignId':value};
                             axios.post('/assignrule/infoAssign/findListInfoAssignByName',param)
                             .then(function (response) {
                                 var data =  response.data;
                                 if(data.code=='0'){
                                     var resData = data.data;
                                     if(resData.length>0){
                                         callback(new Error("此分配规则关联ID已存在，请修改后提交"));
                                     }else{
                                         callback();
                                     }
                                     
                                 }else{
                                      callback(new Error("此分配规则关联ID是否唯一报错"));
                                 }
                             })
                             .catch(function (error) {
                               console.log(error);
                             })
                             .then(function () {
                               // always executed
                             });
             			  
             		  },trigger:'blur'}
                    ] 
    
                }
               

            }        	  
        },
        methods: {
        	initTableData(){
        	 //初始化列表	
                // 查询 table 需要数据
                 var pageSize = this.pager.pageSize;
                 var pageNum = this.pager.currentPage;
                 var teleId= this.telemarketingId;
                 if(teleId=='电销组'){
                	 teleId=''; 
                  }
                 var proId= this.projectId;
                 if(proId=='项目'){
                	 proId=''; 
                 }
                 var assignName=this.assignName
             	 if(0==pageNum){
             		pageNum=1;	
             	 }
                 var param = {};
                 param.telemarketingId = teleId;
                 param.projectName = proId;
                 param.assignName = assignName;
                 param.pageNum=pageNum;
                 param.pageSize=pageSize;
     		    axios.post('/assignrule/infoAssign/queryInfoAssignList',param).then(function (response) {
     				if(null==response){
     					console.log("返回异常");
     					return ;
     				}
     				var resobj= response.data;
     				if(null==resobj){
     					console.log("返回异常");
     					return ;
     				} 
     				if(resobj.code!='0'){
     					console.log(response.data.message);
     					return ;
     				}
     				var pageData=resobj.data;
     				ruleVm.pager.total=pageData.total;
     				ruleVm.pager.currentPage = pageData.currentPage;
     				ruleVm.pager.pageSize = pageData.pageSize;
     				ruleVm.dataTable =pageData.data; 	
     			})
         		
        	},
        	//提交form
        	submitFormType(form){
        		//提交保存
        		if(this.FormType=='1'){
        		  this.submitForm(form);	
        		}else{
        	     this.submitUpdateForm(form);	
        		}
        	},
        	//添加提交
            submitForm(formName) {
                this.$refs[formName].validate((valid) => {
                  if (valid) {
                  this.updateDialogFormVisible=false;
                  var param={};
                  var  projectArray= ruleVm.form.valueMultiple;
                  var proIdArry=[];
                  for(var i=0;i<projectArray.length;i++) {
                	    var pro={};
                	    pro.projectId=projectArray[i];
                	    proIdArry.push(pro);
                    }
                    param.infoAssignProject=proIdArry;
                    param.assignName=ruleVm.form.ruleName;
                    param.telemarketingId=ruleVm.form.value;
                    param.releAssignId=ruleVm.form.ruleID;
                    ruleVm.btnDisabled = true; 
                   axios.post('/assignrule/infoAssign/saveInfoAssign',param)
                       .then(function (response) {
                    	ruleVm.$message({message:'操作成功',type:'success',duration:2000,onClose:function(){
                            ruleVm.btnDisabled = false; 
                    		ruleVm.initTableData();
    		        	}});
                      });
           } else {
                 console.log('error submit!!');
                 return false;
                 }
           });
          },
        	//修改提交
            submitUpdateForm(formName) {
        
                this.$refs[formName].validate((valid) => {
                  if (valid) {
                   this. updateDialogFormVisible=false;
                   var param={};
                   var  projectArray= ruleVm.form.valueMultiple;
                   var proIdArry=[];
                   for(var i=0;i<projectArray.length;i++) {
                	    var pro={};
                	    pro.projectId=projectArray[i];
                	    proIdArry.push(pro);
                    }
                    param.infoAssignProject=proIdArry;
                    param.assignName=ruleVm.form.ruleName;
                    param.telemarketingId=ruleVm.form.value;
                    param.releAssignId=ruleVm.form.ruleID;
                    param.id=ruleVm.oldruleId;
                    ruleVm.btnDisabled = true; 
                   axios.post('/assignrule/infoAssign/updateInfoAssign',param)
                       .then(function (response) {
                    	ruleVm.$message({message:'操作成功',type:'success',duration:2000,onClose:function(){
                            ruleVm.btnDisabled = false; 
                    		ruleVm.initTableData();
    		        	}});
                      });
           } else {
                 console.log('error submit!!');
                 return false;
               }
           });
            },
            //添加规则
            openAddRuleDialog(){
              this.dailogTitleType="添加";
              this.updateDialogFormVisible=true;
          	 if (this.$refs['form']!=undefined) {
           		this.$refs['form'].resetFields();
           	  }
            },
            //修改规则
            openUpdateRuleDialog(){
                //修改菜单数据	
                var param ={};
                this.dailogTitleType="修改";
                this.FormType='2';
            	var rows = this.multseleSelection;
                if(rows.length!=1){
                    this.$message({
                       message: '请选择一条数据进行修改',
                       type: 'warning'
                     });
                    return;
                }
                this.updateDialogFormVisible=true;
             	 if (this.$refs['form']!==undefined) {
                		this.$refs['form'].resetFields();
                 }
                var param={};
                param.id=rows[0].id;
                axios.post('/assignrule/infoAssign/queryInfoAssignById',param)
                .then(function (response) {
                    var data =  response.data
                    if(data.code=='0'){
                       var updateData= response.data.data;
                       var valueMultiple=[];
                       ruleVm.form.ruleName=updateData.assignName;
                       ruleVm.oldruleId=updateData.id;
                       ruleVm.oldruleName=updateData.assignName;
                       ruleVm.form.value=updateData.telemarketingId;
                       ruleVm.form.ruleID=updateData.releAssignId;
                       ruleVm.oldruleRefId=updateData.releAssignId;
                       var assignPro=updateData.infoAssignProject;
                       if(null!=assignPro&&assignPro.length>0) {
                    	   for(var i=0;i<assignPro.length;i++){
                    	       valueMultiple.push(assignPro[i].projectId);
                    	     }
                    	   }
                       ruleVm.form.valueMultiple=valueMultiple;
                	  }});
            },
            handleSelectionChange(val) {
                this.multseleSelection = val;
            },
            deleteDialog(){
            	//选择删除数据
               var deleteData=this.multseleSelection;
               var deleId=[];
               var deleName="";
               if(null==deleteData||deleteData.length<1){
            	   this.$message({
                       message: '请选择删除数据',
                       type: 'warning'
                     });
                    return;
            	}
               if(null!=deleteData&&deleteData.length>0){
            	   for(var i=0;i<deleteData.length;i++){
            		   deleId.push(deleteData[i].id);  
            		   deleName+="【"+deleteData[i].assignName+"】";
            	 }
                }
                this.$confirm('确定要删除'+deleName+'规则？', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                	
                var  param={};
                param.deleInfo=deleId;
                 axios.post('/assignrule/infoAssign/deleteInfoAssign',param)
                    .then(function (response) {
                        var data =  response.data
                        if(data.code=='0'){
                        	ruleVm.$message({message:'操作成功',type:'success',duration:2000,onClose:function(){
                        	ruleVm.initTableData();
                    	  }});
                        }else{
                        	console.error(data);
                        }
                    })
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    });          
                });
            },
            resetForm(formName) {
                console.log( mainDivVM.$refs[formName])
                if( mainDivVM.$refs[formName]){
                    mainDivVM.$refs[formName].resetFields();
                }
            },
            number(){
    　　　      this.form.ruleID=this.form.ruleID.replace(/[^\.\d]/g,'');
                this.form.ruleID=this.form.ruleID.replace('.','');
        　　},
        },
    	 created(){
            // 取页数存储
            var localVal=localStorage.getItem('allChangePageSize')?parseInt(localStorage.getItem('allChangePageSize')):'';
            if(localVal){this.pager.pageSize = localVal;}
    		//初始化数据列表
    		this.initTableData();
    	},//created方法 结束
        mounted(){
            document.getElementById('informationAllot').style.display = 'block';
        }
    })
</script>
</html>